<template>
    <div class="updatePwd">
        <a-form-model ref="ruleForm" :model="ruleForm" :rules="rules" v-bind="layout">
            <a-form-model-item has-feedback label="推荐单位名称" prop="tjdwMc">
                <!-- disabled -->
                <a-input v-model="ruleForm.tjdwMc" disabled/>
            </a-form-model-item>
            <a-form-model-item has-feedback label="联系人" prop="tjdwLxr">
                <a-input v-model="ruleForm.tjdwLxr" autocomplete="off" />
            </a-form-model-item>
            <a-form-model-item has-feedback label="部门" prop="tjdwBm">
                <a-input v-model="ruleForm.tjdwBm" autocomplete="off" />
            </a-form-model-item>
            <a-form-model-item has-feedback label="职务" prop="tjdwZw">
                <a-input v-model="ruleForm.tjdwZw" autocomplete="off" />
            </a-form-model-item>
            <a-form-model-item has-feedback label="手机" prop="tjdwTel">
                <a-input v-model="ruleForm.tjdwTel" autocomplete="off" />
            </a-form-model-item>
            <a-form-model-item has-feedback label="座机" prop="tjdwZj">
                <a-input v-model="ruleForm.tjdwZj" autocomplete="off" />
            </a-form-model-item>
            <a-form-model-item has-feedback label="邮箱" prop="tjdwYx">
                <a-input v-model="ruleForm.tjdwYx" autocomplete="off" />
            </a-form-model-item>
            <a-form-model-item has-feedback label="是否公开" prop="isGk">
                <a-switch v-model="ruleForm.isGk" />
                <span style="margi-left:20px;">“如果选择公开，申报单位将可以看到您的联系方式（姓名、座机和邮箱）”</span>
            </a-form-model-item>
            <a-form-model-item has-feedback label="当前状态" prop="isGk">
                <span style="margi-left:20px;" v-if="ruleForm.isQr">已确认</span>
                <span style="margi-left:20px;color:red" v-else="">未确认（请点击保存按钮进行信息确认）</span>
            </a-form-model-item>
            <!-- <a-form-model-item has-feedback label="是否确认" prop="isQr">
                <a-switch v-model="ruleForm.isQr" />
            </a-form-model-item> -->
            <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
                <a-button type="primary" @click="submitForm('ruleForm')">保存</a-button>
                <a-button style="margin-left: 10px" @click="resetForm('ruleForm')">重置</a-button>
            </a-form-model-item>
        </a-form-model>
    </div>
</template>
<script>
import {
    // 创新奖推荐-保存和修改推荐单位信息
    cxjtjAddTjdwxx,
    // 创新奖推荐-通过成果id获取推荐单位信息
    cxjtjGetTjdwxxBycgid,
    // 创新奖推荐-获取推荐单位信息
    cxjtjGetTjdwxx,
} from "@/api/api";
export default {
    data() {
        let validateTel = (rule, value, callback) => {
            const reg = /^[1][2,3,4,5,6,7,8,9][0-9]{9}$/
            if (value === '') {
                callback(new Error('请填写手机号！'))
            } else if (!reg.test(value)) {
                callback(new Error("请输入正确的手机号码！"))
            } else {
                callback()
            }
        }
        let validateZj = (rule, value, callback) => {
            const reg = /^0\d{2,3}-[1-9]\d{6,7}$/
            if (value === '') {
                callback(new Error('请填写座机！'))
            } else if (!reg.test(value)) {
                callback(new Error("请输入正确的座机号码！"))
            } else {
                callback()
            }
        }
        return {
            tjdwInfo: {},
            ruleForm: {
                tjdwMc: '',
                tjdwLxr: '',
                tjdwBm: '',
                tjdwZw:'',
                tjdwTel:'',
                tjdwZj: '',
                tjdwYx: '',
                isGk: false,
                isQr: false
            },
            rules: {
                tjdwMc: [{ required: true, message: '请填写推荐单位名称', trigger: 'blur' }],
                tjdwLxr: [{ required: true, message: '请填写联系人', trigger: 'blur' }],
                tjdwBm: [{ required: true, message: '请填写部门', trigger: 'blur' }],
                tjdwZw: [{ required: true, message: '请填写职务', trigger: 'blur' }],
                tjdwTel: [{ validator: validateTel, required: true, trigger: 'blur' }],
                tjdwZj: [{ validator: validateZj, required: true, trigger: 'blur' }],
                tjdwYx: [{ required: true, message: '请填写邮箱', trigger: 'blur' }]
            },
            layout: {
                labelCol: { span: 4 },
                wrapperCol: { span: 10 }
            },
            cxjtjGetTjdwxxBycgidInfo: {}
        }
    },
    mounted(){
        this.getTjdwInfo();
    },
    methods: {
        // 回显推荐单位信息
        getTjdwInfo(){
            cxjtjGetTjdwxx().then(res=>{
                console.log(res)
                 if (res.code == 200) {
                    this.tjdwInfo = res.result;
                    if (res.result.tjdwmc) {
                        this.ruleForm.tjdwMc = res.result.tjdwmc;
                    }
                    if (res.result.tjdwxx) { 
                        this.ruleForm = {
                            tjdwMc: res.result.tjdwmc,
                            id: res.result.tjdwxx.id,
                            sysCxjJttjdwId:res.result.tjdwxx.sysCxjJttjdwId,
                            tjdwLxr: res.result.tjdwxx.tjdwxxLxr,
                            tjdwBm: res.result.tjdwxx.tjdwxxBm,
                            tjdwZw:res.result.tjdwxx.tjdwxxZw,
                            tjdwTel:res.result.tjdwxx.tjdwxxSj,
                            tjdwZj: res.result.tjdwxx.tjdwxxZj,
                            tjdwYx: res.result.tjdwxx.tjdwxxYx,
                            isGk: res.result.tjdwxx.tjdwxxSfgk=='Y'?true:false,
                            isQr: res.result.tjdwxx.tjdwxxSfqr=='Y'?true:false
                        }
                    }
                }
            })
        },
        submitForm(formName) {
            this.$refs[formName].validate(valid => {
                if (valid) {
                    let self = this;
                    let data = {
                        id: self.ruleForm.id,
                        sysCxjJttjdwId: self.ruleForm.sysCxjJttjdwId,
                        tjdwxxLxr: self.ruleForm.tjdwLxr,
                        tjdwxxBm: self.ruleForm.tjdwBm,
                        tjdwxxZw: self.ruleForm.tjdwZw,
                        tjdwxxSj: self.ruleForm.tjdwTel,
                        tjdwxxZj: self.ruleForm.tjdwZj,
                        tjdwxxYx: self.ruleForm.tjdwYx,
                        tjdwxxSfgk: self.ruleForm.isGk?'Y':'N',
                        tjdwxxSfqr: self.ruleForm.isQr?'Y':'N',
                    }
                    console.log(data)
                    cxjtjAddTjdwxx(data).then(res=>{
                        if (res.code == 200) {
                            self.$message.success(res.message,10);
                            self.getTjdwInfo();
                        } else {
                            self.$message.error(res.message,10);
                            self.getTjdwInfo();
                        }
                    })
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },
        resetForm(formName) {
            this.$refs[formName].resetFields()
        }
    }
}
</script>
<style>
    
.updatePwd {
    padding: 20px 0;
    background: #fff;
}
</style>
